Full source code website bán hàng thương mại điện tử gần giống shopee
472.095 lượt xem;
1 body {
2 background: url("/images/slider-2.jpg") no-repeat center center fixed;
3 background-size: cover;
4 font-size: 16px;
5 font-family:Tahoma, Arial, Helvetica, sans-serif;
6 font-weight: 300;
7 margin: 0;
8 color: #666;
9 }
10
11 /* Typography */
12 h1#title {
13 font-family: 'Roboto Slab', serif;
14 font-weight: 300;
15 font-size: 3.2em;
16 color: white;
17 text-shadow: 0 0 10px rgba(0,0,0,0.8);
18 margin: 0 auto;
19 padding-top: 30px;
20 *max-width: 300px;
21 text-align: center;
22 position: relative;
23 top: 0px;
24 }
25
26 h1#title span span {
27 font-weight: 400;
28 }
29
30 h2 {
31 text-transform: uppercase;
32 color: white;
33 font-weight: 400;
34 letter-spacing: 1px;
35 font-size: 1.4em;
36 line-height: 2.8em;
37 font-weight: bold;
38 }
39
40 a {
41 text-decoration: none;
42 color: #666;
43 }
44
45 a:hover {
46 color: #aeaeae;
47 }
48
49 p.small {
50 font-size: 0.8em;
51 margin: 20px 0 0;
52 }
53
54
55 /* Layout */
56 .container {
57 margin: 0;
58 }
59
60 .top {
61 margin: 0;
62 padding: 0;
63 width: 100%;
64 background: -moz-linear-gradient(top, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
65 background: -webkit-linear-gradient(top, rgba(0,0,0,0.6) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
66 background: linear-gradient(to bottom, rgba(0,0,0,0.6) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
67 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#99000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
68 }
69
70 .login-box {
71 background-color: white;
72 max-width: 340px;
73 margin: 0 auto;
74 position: relative;
75 top: 80px;
76 padding-bottom: 30px;
77 border-radius: 5px;
78 box-shadow: 0 5px 50px rgba(0,0,0,0.4);
79 text-align: center;
80 }
81
82 .login-box .box-header {
83 background-color: #F44336;
84 margin-top: 0;
85 border-radius: 5px 5px 0 0;
86 }
87
88 .login-box label {
89 font-weight: 700;
90 font-size: .8em;
91 *color: #888;
92 letter-spacing: 1px;
93 *text-transform: uppercase;
94 line-height: 2em;
95 }
96
97 .login-box input {
98 margin-bottom: 20px;
99 padding: 8px;
100 border: 1px solid #ccc;
101 border-radius: 2px;
102 font-size: .9em;
103 color: #888;
104 }
105
106 .login-box input:focus {
107 outline: none;
108 border-color: #665851;
109 transition: 0.5s;
110 color: #665851;
111 }
112
113 .login-box button {
114 margin-top: 0px;
115 border: 0;
116 border-radius: 2px;
117 color: white;
118 padding: 14px;
119 text-transform: uppercase;
120 font-weight: 400;
121 font-size: 0.7em;
122 letter-spacing: 1px;
123 background-color: #665851;
124 cursor: pointer;
125 outline: none;
126 margin-left: 16px;
127 font-weight: bold;
128 }
129
130 .login-box button:hover {
131 opacity: 0.7;
132 transition: 0.5s;
133 }
134
135 .login-box button:hover {
136 opacity: 0.7;
137 transition: 0.5s;
138 }
139
140 .selected {
141 color: #665851!important;
142 transition: 0.5s;
143 }
144
145 /* Animation Delay */
146 #logo {
147 -webkit-animation-duration: 1s;
148 -webkit-animation-delay: 2s;
149 }
150
151 .login-box {
152 -webkit-animation-duration: 1s;
153 -webkit-animation-delay: 1s;
154 }
2 background: url("/images/slider-2.jpg") no-repeat center center fixed;
3 background-size: cover;
4 font-size: 16px;
5 font-family:Tahoma, Arial, Helvetica, sans-serif;
6 font-weight: 300;
7 margin: 0;
8 color: #666;
9 }
10
11 /* Typography */
12 h1#title {
13 font-family: 'Roboto Slab', serif;
14 font-weight: 300;
15 font-size: 3.2em;
16 color: white;
17 text-shadow: 0 0 10px rgba(0,0,0,0.8);
18 margin: 0 auto;
19 padding-top: 30px;
20 *max-width: 300px;
21 text-align: center;
22 position: relative;
23 top: 0px;
24 }
25
26 h1#title span span {
27 font-weight: 400;
28 }
29
30 h2 {
31 text-transform: uppercase;
32 color: white;
33 font-weight: 400;
34 letter-spacing: 1px;
35 font-size: 1.4em;
36 line-height: 2.8em;
37 font-weight: bold;
38 }
39
40 a {
41 text-decoration: none;
42 color: #666;
43 }
44
45 a:hover {
46 color: #aeaeae;
47 }
48
49 p.small {
50 font-size: 0.8em;
51 margin: 20px 0 0;
52 }
53
54
55 /* Layout */
56 .container {
57 margin: 0;
58 }
59
60 .top {
61 margin: 0;
62 padding: 0;
63 width: 100%;
64 background: -moz-linear-gradient(top, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
65 background: -webkit-linear-gradient(top, rgba(0,0,0,0.6) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
66 background: linear-gradient(to bottom, rgba(0,0,0,0.6) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
67 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#99000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
68 }
69
70 .login-box {
71 background-color: white;
72 max-width: 340px;
73 margin: 0 auto;
74 position: relative;
75 top: 80px;
76 padding-bottom: 30px;
77 border-radius: 5px;
78 box-shadow: 0 5px 50px rgba(0,0,0,0.4);
79 text-align: center;
80 }
81
82 .login-box .box-header {
83 background-color: #F44336;
84 margin-top: 0;
85 border-radius: 5px 5px 0 0;
86 }
87
88 .login-box label {
89 font-weight: 700;
90 font-size: .8em;
91 *color: #888;
92 letter-spacing: 1px;
93 *text-transform: uppercase;
94 line-height: 2em;
95 }
96
97 .login-box input {
98 margin-bottom: 20px;
99 padding: 8px;
100 border: 1px solid #ccc;
101 border-radius: 2px;
102 font-size: .9em;
103 color: #888;
104 }
105
106 .login-box input:focus {
107 outline: none;
108 border-color: #665851;
109 transition: 0.5s;
110 color: #665851;
111 }
112
113 .login-box button {
114 margin-top: 0px;
115 border: 0;
116 border-radius: 2px;
117 color: white;
118 padding: 14px;
119 text-transform: uppercase;
120 font-weight: 400;
121 font-size: 0.7em;
122 letter-spacing: 1px;
123 background-color: #665851;
124 cursor: pointer;
125 outline: none;
126 margin-left: 16px;
127 font-weight: bold;
128 }
129
130 .login-box button:hover {
131 opacity: 0.7;
132 transition: 0.5s;
133 }
134
135 .login-box button:hover {
136 opacity: 0.7;
137 transition: 0.5s;
138 }
139
140 .selected {
141 color: #665851!important;
142 transition: 0.5s;
143 }
144
145 /* Animation Delay */
146 #logo {
147 -webkit-animation-duration: 1s;
148 -webkit-animation-delay: 2s;
149 }
150
151 .login-box {
152 -webkit-animation-duration: 1s;
153 -webkit-animation-delay: 1s;
154 }
